<template>
		<div>
			<div class="item border-bottom" v-for="(item,index) of categoryList" :key="index">
					<span class="ticket-span"></span>
						{{item.title}}
						
					<div v-if="item.children" class="item-children">
						<detail-list :categoryList='item.children'></detail-list>
					</div>
			</div>
		</div>
</template>

<script>
	export default{
		name: 'detailList',
		props: {
			categoryList:Array
		}
	}
</script>
 
<style lang="stylus" scoped>
		.item{
			line-height:.8rem;
			font-size:.32rem;
			padding: .02rem;
			
		}
		.ticket-span{
			position: relative;
			display: inline-block;
			left:.2rem;
	    width: .36rem
	    height: .36rem
	    top: .1rem
	    margin-right: .2rem
	    background: url(//s.qunarzz.com/piao/image/touch/sight/detail.png) 0 -.45rem no-repeat;
	    background-size: .4rem 3rem
		}
		.item-children{
			margin-left:.2rem
		}
			
	    
</style>